<template>
  <!-- menu -->
  <div class="menu-Box">
    <nav class="menu">
          <p>
            <router-link exact v-for="(item,index) in navList" :to="item.to" :key="item.index">{{item.value}}</router-link>
          </p>
          <div class="selectB">
              <div class="select">
                  <input class="select-text" type="text" placeholder="请输入关键词">
                  <input class="select-btn" type="button">
              </div>
          </div>
      </nav>
  </div>
  <!-- menu -->
</template>

<script>
export default {
  name: 'navBar',
  data () {
    return {
      navList:[{to:'/',value:'首页'},{to:'/jsbw',value:'技术博文'},{to:'/yytj',value:'影音推荐'},
              {to:'/msfx',value:'美食分享'},{to:'/shjq',value:'生活技巧'},{to:'/xhdq',value:'笑话大全'}],
      active: false
    }
  },
  mounted:function(){
    this.$http.get('http://www.eblog.site/eblog/getTags')
      .then(function (response) {
      },function (response) {
    });
  },
  methods:{
    
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
.router-link-exact-active,.router-link-active{
  background:#0269c6;
  text-decoration:none;
}
</style>
